<!-- 侧边栏模板 -->
<div class="sidebar">
    <button class="sidebar-toggle">
        <i class="fas fa-chevron-left"></i>
    </button>
    <div class="logo">
        <img src="img/python-logo.png" alt="Python工业预测模型Logo">
        <span class="logo-text">异烟酸生产收率预测</span>
    </div>
    <nav class="nav-menu">
        <a href="index.html" class="nav-item" data-title="首页">
            <i class="fas fa-home nav-icon"></i>
            <span class="nav-text">首页</span>
        </a>
        <a href="qd-display.html" class="nav-item" data-title="主控面板">
            <i class="fas fa-tachometer-alt nav-icon"></i>
            <span class="nav-text">主控面板</span>
        </a>
        <a href="model-value.html" class="nav-item" data-title="模型应用价值">
            <i class="fas fa-chart-line nav-icon"></i>
            <span class="nav-text">模型应用价值</span>
        </a>
        <a href="system-architecture.html" class="nav-item" data-title="系统架构设计">
            <i class="fas fa-project-diagram nav-icon"></i>
            <span class="nav-text">系统架构设计</span>
        </a>
        <a href="data-flow.html" class="nav-item" data-title="数据流设计">
            <i class="fas fa-database nav-icon"></i>
            <span class="nav-text">数据流设计</span>
        </a>
        <a href="model-deployment.html" class="nav-item" data-title="模型部署与应用">
            <i class="fas fa-cogs nav-icon"></i>
            <span class="nav-text">模型部署与应用</span>
        </a>
        <a href="ui-design.html" class="nav-item" data-title="用户界面设计">
            <i class="fas fa-desktop nav-icon"></i>
            <span class="nav-text">用户界面设计</span>
        </a>
        <a href="yield-prediction.html" class="nav-item" data-title="收率预测">
            <i class="fas fa-flask nav-icon"></i>
            <span class="nav-text">收率预测</span>
        </a>
        <a href="parameter-monitoring.html" class="nav-item" data-title="关键参数监控">
            <i class="fas fa-eye nav-icon"></i>
            <span class="nav-text">关键参数监控</span>
        </a>
        <a href="online-analysis.html" class="nav-item" data-title="在线分析">
            <i class="fas fa-chart-bar nav-icon"></i>
            <span class="nav-text">在线分析</span>
        </a>
        <a href="model-performance.html" class="nav-item" data-title="模型性能">
            <i class="fas fa-chart-pie nav-icon"></i>
            <span class="nav-text">模型性能</span>
        </a>
        <a href="model-details.html" class="nav-item" data-title="模型详情">
            <i class="fas fa-info-circle nav-icon"></i>
            <span class="nav-text">模型详情</span>
        </a>
        <a href="model-update.html" class="nav-item" data-title="模型更新">
            <i class="fas fa-sync-alt nav-icon"></i>
            <span class="nav-text">模型更新</span>
        </a>
        <a href="model-config.html" class="nav-item" data-title="系统配置">
            <i class="fas fa-sliders-h nav-icon"></i>
            <span class="nav-text">系统配置</span>
        </a>
        <a href="documentation.html" class="nav-item" data-title="技术文档">
            <i class="fas fa-book nav-icon"></i>
            <span class="nav-text">技术文档</span>
        </a>
    </nav>
    <div class="sidebar-footer">
        <div class="user-info">
            <img class="user-avatar" src="https://cdn-icons-png.flaticon.com/512/1077/1077114.png" alt="User">
            <span class="user-name">管理员</span>
        </div>
        <a href="#" class="logout-btn">
            <i class="fas fa-sign-out-alt"></i>
        </a>
    </div>
</div>

<!-- 移动端菜单遮罩层 -->
<div class="sidebar-overlay"></div>

<!-- 移动端菜单按钮 -->
<button class="mobile-toggle d-none">
    <i class="fas fa-bars"></i>
</button> 